<template>
  <div>
    <div>
      <ele-page
        v-loading="loading"
        :formConfig="searchConfig"
        ref="eleTable"
        :operateList="operateList"
        @handleOperateEvent="handleOperateEvent"
        :column="column"
        :getList="getList"
        uniqueId="mesProdBarcodeReprintTable"
      >
      </ele-page>
    </div>
    <ele-form-drawer
      class="dialog-pack"
      :isLoading="isLoading"
      v-model="formDataDialog"
      v-bind="formDescDialog"
      :request-fn="handleSubmit"
      :visible.sync="visible"
      :title="title"
    >
      <template v-slot:form-btn="{}">
        <el-button @click="dialogClose">{{
          $i18n.t("common.cancel")
        }}</el-button>
        <el-button @click="reject" type="danger">{{
          $i18n.t("mesProdBarcodeReprint.examineReject")
        }}</el-button>
        <el-button @click="pass" type="success">{{
          $i18n.t("mesProdBarcodeReprint.examinePass")
        }}</el-button>
      </template>
    </ele-form-drawer>
  </div>
</template>

<script>
import { operateList, searchConfig, formDescDialog, rowConfig } from "./config";
import {
  getList,
  rowCreate,
  rowUpdate,
  rowDel,
  rowDetail,
  examine,
} from "@/api/barcodeprint/mesProdBarcodeReprint";
import { getDict } from "@/api/common";

export default {
  name: "mesProdBarcodeReprint",
  components: {},
  mixins: [searchConfig],
  data() {
    return {
      title: null,
      visible: false,
      isLoading: false,
      loading: false,
      formDataDialog: {},
      formDescDialog, // 新增修改框
      // searchConfig,
      operateList,
      getList,
      // 列表页字段的绑定配置
      column: [
        // {
        //   type: "selection",
        // },
        {
          type: "index",
          label: this.$i18n.t("common.order"),
          fixed: "left",
          width: 60,
        },
        {
          prop: "orderCode",
          minWidth: 240,
          label: this.$i18n.t("mesProdBarcodeReprint.orderCode"),
          showOverflowTooltip: true,
        },
        {
          minWidth: 180,
          prop: "prodCode",
          label: this.$i18n.t("mesProdBarcodeReprint.prodCode"),
          showOverflowTooltip: true,
        },
        {
          prop: "prodName",
          label: this.$i18n.t("mesProdBarcodeReprint.prodName"),
          minWidth: 180,
          showOverflowTooltip: true,
        },
        {
          prop: "planBeginDate",
          label: this.$i18n.t("mesProdBarcodeReprint.planBeginDate"),
          showOverflowTooltip: true,
          width: 130,
        },
        {
          prop: "workshopName",
          label: this.$i18n.t("common.workshopName"),
          showOverflowTooltip: true,
          minWidth: 180,
        },
        {
          prop: "lineName",
          label: this.$i18n.t("common.lineName"),
          showOverflowTooltip: true,
          minWidth: 180,
        },
        {
          prop: "startBarcode",
          label: this.$i18n.t("mesProdBarcodeReprint.startBarcode"),
          showOverflowTooltip: true,
          minWidth: 300,
        },
        {
          prop: "endBarcode",
          label: this.$i18n.t("mesProdBarcodeReprint.endBarcode"),
          showOverflowTooltip: true,
          minWidth: 300,
        },
        {
          prop: "printTemp",
          label: this.$i18n.t("mesProdBarcodeReprint.printTemp"),
          showOverflowTooltip: true,
          minWidth: 250,
        },
        {
          prop: "status",
          label: this.$i18n.t("common.status"),
          showOverflowTooltip: true,
          minWidth: 80,
          optionProp: {
            value: "value",
            label: "description",
          },
          option: async (data) => {
            const list = await getDict("mes_barcode_reprint_status");
            return list.data.result;
          },
        },
        {
          prop: "examineByName",
          label: this.$i18n.t("mesProdBarcodeReprint.examineByName"),
          showOverflowTooltip: true,
        },
        {
          showOverflowTooltip: true,
          prop: "examineTime",
          label: this.$i18n.t("mesProdBarcodeReprint.examineTime"),
          width: 180,
        },
        {
          prop: "examineContent",
          label: this.$i18n.t("mesProdBarcodeReprint.examineContent"),

          width: 180,
          showOverflowTooltip: true,
        },
        {
          prop: "isPrint",
          label: this.$i18n.t("mesProdBarcodeReprint.isPrint"),
          optionProp: {
            value: "value",
            label: "description",
          },
          option: async (data) => {
            const list = await getDict("yes_or_not");
            return list.data.result;
          },
        },
        {
          prop: "createByName",
          label: this.$i18n.t("mesProdBarcodeReprint.createByName"),
          showOverflowTooltip: true,
        },
        {
          prop: "createTime",
          label: this.$i18n.t("mesProdBarcodeReprint.createTime"),
          showOverflowTooltip: true,
          width: 180,
        },
        {
          prop: "operate",
          label: this.$i18n.t("common.operation"),
          width: 160,
          fixed: "right",
          render: (h, scope) => {
            if (scope.row.status == "noExamine") {
              return (
                <ele-row-operation
                  scope={scope}
                  rowConfig={rowConfig}
                  onRowOperate={this.rowOperate}
                />
              );
            } else {
              return "";
            }
          },
        },
      ],
    };
  },
  computed: {},
  methods: {
    // 表格顶部按钮操作事件
    handleOperateEvent(data) {
      this.title = data.name;
      const fnc = {
        add: () => {
          this.disableFields(false);
          this.formDataDialog = {};
          this.visible = true;
        },
        deleteBatch: () => {
          this.$confirm(
            $i18n.t("common.deleteBatch", {
              name: $i18n.t("mesProdBarcodeReprint.name"),
            }),
            $i18n.t("common.tip"),
            {
              confirmButtonText: $i18n.t("common.ok"),
              cancelButtonText: $i18n.t("common.cancel"),
              type: "warning",
            }
          ).then(() => {
            const ids = data.rows.map((val) => val.id).join(",");
            this.rowDel(ids);
          });
        },
        import: () => {
          this.importDialogData = {};
          this.importVisible = true;
        },
      };
      fnc[data.handleName]();
    },
    // 表格行操作事件
    rowOperate({ handleName, name, row }) {
      this.title = name;
      const fnc = {
        edit: () => {
          this.disableFields(false);
          this.rowDetail(row.id);
          this.visible = true;
        },
        detail: () => {
          this.disableFields(true);
          this.rowDetail(row.id);
          this.visible = true;
        },
        delete: () => {
          // this.$confirm("此操作将删除该唯一码补打申请, 是否继续?", "提示", {
          //   confirmButtonText: "确定",
          //   cancelButtonText: "取消",
          //   type: "warning",
          // }).then(() => {
          //   this.rowDel(row.id);
          // });
        },
        examine: () => {
          if (row.hasOwnProperty("examineTime")) {
            this.$message.error(
              this.$i18n.t("mesProdBarcodeReprint.alreadyExamine")
            );
            return;
          } else {
            this.disableFields(false);
            this.rowDetail(row.id);
            this.visible = true;
          }
        },
      };
      fnc[handleName]();
    },
    doSubmit({ title, api, data }) {
      this.isLoading = true;
      api(data)
        .then((res) => {
          const message = res.data.message;
          this.$message.success(message || title);
          this.visible = false;
          this.refresh();
        })
        .finally(() => {
          this.isLoading = false;
        });
    },
    // 弹框提交事件
    handleSubmit(data) {
      if (this.isLoading) return; // 判断状态
      const params = this.formDataDialog.id
        ? { title: $i18n.t("common.editSuccess"), api: rowUpdate, data }
        : { title: $i18n.t("common.addSuccess"), api: rowCreate, data };
      this.doSubmit(params);
    },
    // 删除
    rowDel(data) {
      this.loading = true;
      rowDel(data)
        .then((res) => {
          const message = res.data.message;
          this.$message.success(
            message || $i18n.t("common.deleteSuccess")
          );
          this.refresh();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    disableFields(flag) {
      this.formDescDialog.disabled = flag;
      this.formDescDialog.isShowSubmitBtn = !flag;
    },
    rowDetail(id) {
      rowDetail(id).then((res) => {
        this.formDataDialog = res.data.result;
      });
    },
    // 刷新表格数据
    refresh(isReset = true) {
      this.$refs.eleTable.refresh(isReset);
    },
    dialogClose() {
      this.visible = false;
    },
    reject() {
      console.log("form", this.formDataDialog);
      if (this.formDataDialog.examineContent) {
        const data = {
          id: this.formDataDialog.id,
          examineResult: "0",
          examineContent: this.formDataDialog.examineContent,
        };
        this.examine(data);
      } else {
        this.$message.error(
          this.$i18n.t("mesProdBarcodeReprint.examineContentRequired")
        );
      }
    },
    pass() {
      if (this.formDataDialog.examineContent) {
        const data = {
          id: this.formDataDialog.id,
          examineResult: "1",
          examineContent: this.formDataDialog.examineContent,
        };
        this.examine(data);
      } else {
        this.$message.error(
          this.$i18n.t("mesProdBarcodeReprint.examineContentRequired")
        );
      }
    },
    examine(data) {
      this.loading = true;
      examine(data)
        .then((res) => {
          const message = res.data.message;
          this.$message.success(
            message || this.$i18n.t("mesProdBarcodeReprint.examineSuccess")
          );
          this.refresh();
        })
        .finally(() => {
          this.visible = false;
          this.loading = false;
        });
    },
  },
};
</script>
